<template>
  <div>
    <!-- <a-form-model-item label="用户1" prop="">
      <z-select-user
        @change="userChange"
        v-model="newValue.user"
      />
    </a-form-model-item>
    <a-form-model-item label="角色" prop="">
      <z-select-role
        @change="roleChange"
        v-model="newValue.role"
      />
    </a-form-model-item>
    <a-form-model-item label="单位" prop="">
      <z-select-unit
        @change="unitChange"
        placeholder="请选择单位"
        v-model="newValue.unit"
      />
    </a-form-model-item> -->
    <a-form-model-item :required="true"
                       label="接收人">
      <ZUserUnitRoleAuthority v-if="formId"
                              v-model="newValue"
                              @input="authorityChange"
                              service="application"
                              :formId="formId" />
    </a-form-model-item>
  </div>
</template>

<script>
import PropTypes from '@zh/common-utils/prop-types'
import _isEqual from 'lodash/isEqual'

export default {
  name: 'TaskRecipient',
  props: {
    value: {
      type: Object,
      default: () => {
        return {
          newValue: {
            unit: [],
            user: [],
            role: [],
            memberUsers: [],
            memberUnits: [],
            memberRoles: []
          }
        }
      }
    },
    form: {
      type: Object,
      default: () => ({})
    },
    formId: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      forms: {},
      newValue: {
        unit: [],
        user: [],
        role: [],
        memberUsers: [],
        memberUnits: [],
        memberRoles: []
      }
    }
  },
  watch: {
    value: {
      handler (value, oldValue) {
        if (!_isEqual(value, oldValue)) {
          let val = {}
          val.unit = value.unitList
          val.user = value.userList
          val.role = value.roleList
          val.memberUsers = value.memberUsers
          val.memberUnits = value.memberUnits
          val.memberRoles = value.memberRoles
          this.newValue = val
        }
      },
      immediate: true,
      deep: true
    }
  },
  methods: {
    authorityChange (vals, list) {
      this.unitChange(vals.unit, list.unitList)
      this.userChange(vals.user, list.userList)
      this.roleChange(vals.role, list.roleList)
      let val = {}
      val.unitList = this.newValue.unit
      val.userList = this.newValue.user
      val.roleList = this.newValue.role
      val.memberUsers = this.newValue.memberUsers
      val.memberUnits = this.newValue.memberUnits
      val.memberRoles = this.newValue.memberRoles
      this.$emit('input', val)
    },
    unitChange (all, unit) {
      let memberUnits = []
      for (let j = 0; j < unit.length; j++) {
        const ut = unit[j]
        memberUnits.push({
          memberId: ut.id,
          memberName: ut.name,
          type: 2
        })
      }
      this.newValue = {
        ...this.newValue,
        memberUnits: memberUnits
      }
    },
    userChange (all, user) {
      let memberUsers = []
      for (let j = 0; j < user.length; j++) {
        const us = user[j]
        memberUsers.push({
          memberId: us.id,
          memberName: us.name,
          type: 1
        })
      }
      this.newValue = {
        ...this.newValue,
        memberUsers: memberUsers
      }
    },
    roleChange (all, role) {
      let memberRoles = []
      for (let j = 0; j < role.length; j++) {
        const ul = role[j]
        memberRoles.push({
          memberId: ul.id,
          memberName: ul.name,
          type: 3
        })
      }
      this.newValue = {
        ...this.newValue,
        memberRoles: memberRoles
      }
    }
  }
}
</script>

<style scoped>
</style>
